@import '../../theme.scss';
@import '../../mixin.scss';

.editor-modal {
  .ant-modal-body {
    padding: 0;
  }
}

.dialog-editor {
  height: 90vh;

  .save-btn {
    position: absolute;
    top: 7px;
    right: 60px;

    background-color: initial;
    background-image: linear-gradient(92.83deg, #ff7426 0, #f93a13 100%);
    content: '';
    overflow: hidden;
    transition: all 100ms ease-out;
    border: none;
  }

  .switch-btn {
    margin-left: 20px;
  }

  .config-wrap {
    display: flex;
    height: 100%;
    .left {
      flex: 3;
      font-size: 11px;
      display: flex;
      flex-direction: column;
    }
    .right {
      h2 {
        text-align: center;
      }
      flex: 2;
      padding: 0 10px;
      background-color: rgb(27, 38, 49);
      background-color: #000;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow-y: auto;
      @include scrollbar();
    }
  }
}

.example-box {
  @include noselect();
  padding-bottom: 5px;
  word-wrap: break-word;
  word-break: break-all;
  white-space: pre-wrap;

  .example-title {
    font-weight: bold;
    color: rgb(52, 152, 219);
    color: rgb(142, 68, 173);
    padding: 2px 0;
  }
}

.editor-toolbar {
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 10px;
  background-color: rgb(14, 102, 85);
  color: #ccc;
}
